<template>
  <div class="app-container">
    <!-- form表单 -->
    <el-form :inline="true" :model="formData" class="demo-form-inline">
      <el-form-item>
        <el-input v-model="formData.tableName" placeholder="表名" clearable></el-input>
      </el-form-item>
      <el-form-item>
        <el-button @click="getDataList">查询</el-button>
        <el-button icon="el-icon-document" type="primary" @click="generatorCodeHandler">生成代码</el-button>
      </el-form-item>
    </el-form>
    <!-- 列表 -->
    <el-table
      :data="list"
      border
      style="width: 100%;margin-top: 10px;" 
      v-loading="listLoading"
      @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" />
      <el-table-column align="center" prop="tableName" label="表名" />
      <el-table-column align="center" prop="tableType" label="表类型" />
      <el-table-column align="center" prop="tableCat" label="表所属数据库" />
      <el-table-column align="center" prop="remarks" label="表备注" />
    </el-table>

    <!-- 生成代码弹框 -->
    <el-dialog
      title="生成代码"
      :visible.sync="dialogVisible"
      width="30%"
      :close-on-click-modal="false">
      <el-form ref="form" :model="dataForm" :rules="rules" label-width="80px">
        <el-form-item label="表集合">
          <span v-for="(item, index) in multipleSelection" :key="index">
            {{ item.tableName }},
          </span>
        </el-form-item>
        <el-form-item label="作者名称" prop="author">
          <el-input v-model="dataForm.author"></el-input>
        </el-form-item>
        <el-form-item label="包名" prop="packageParent">
          <el-input v-model="dataForm.packageParent"></el-input>
        </el-form-item>
        <el-form-item label="模块名" prop="moduleName">
          <el-input v-model="dataForm.moduleName"></el-input>
        </el-form-item>
        <el-form-item label="实体类的包名" prop="packageEntity">
          <el-input v-model="dataForm.packageEntity"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="generatorCode">生成代码</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  import dataListApi from '@/api/generator/dataList'
  export default {
    data () {
      return {
        list: [],
        listLoading: false,
        formData: {
          tableName: ''
        },
        multipleSelection: [],
        dialogVisible: false,
        dataForm: {
          author: '',
          packageParent: '',
          packageEntity: '',
          tableList: [],
          outPutDirType: 2,
          moduleName: ''
        },
        rules: {
          author: [
            { required: true, message: '请填写作者名称', trigger: 'blur' }
          ],
          packageParent: [
            { required: true, message: '请填写包名', trigger: 'blur' }
          ],
          packageEntity: [
            { required: true, message: '请填写实体类包名', trigger: 'blur' }
          ],
          moduleName: [
            { required: true, message: '请填写模块名', trigger: 'blur' }
          ]
        }
      }
    },
    created() {
      this.getDataList()
    },
    methods: {
      // 查询
      getDataList() {
        this.listLoading = true
        dataListApi.listAll(this.formData).then(res => {
          this.list = res.data.lists
          this.listLoading = false
        })
      },
      // 生成代码
      generatorCodeHandler() {
        if (this.multipleSelection.length <= 0) {
          this.$message.error("请选择要生成的表")
          return
        }
        this.dialogVisible = true
      },
      handleSelectionChange(val) {
        this.multipleSelection = val
      },
      generatorCode() {
        this.$refs['form'].validate((valid) => {
          if (valid) {
            this.dataForm.tableList = []
            for (var i=0;i<this.multipleSelection.length;i++) {
              this.dataForm.tableList.push(this.multipleSelection[i].tableName)
            }
            //location.href = process.env.VUE_APP_BASE_API + '/generator/tableList/generatorCode?generatorCode=' + encodeURIComponent(JSON.stringify(this.dataForm))
            dataListApi.generatorCode(this.dataForm).then(res => {
              var data = res.data
              if (data.code === 200) {
                this.$alert('代码生成完成，请去【' + data.path + '】查看代码', '提示', {
                  confirmButtonText: '确定',
                  callback: action => {
                    this.$message({
                      type: 'info',
                      message: `action: ${ action }`
                    });
                  }
                })
              }
            })
          } else {
            return false
          }
        })
        
      }
    }
  }
</script>

<style scoped></style>